<template>
    <div class="table">
        <!--主体-->
        <div class="container">
            <i class="el-icon-refresh" style="font-size: 18px;padding-bottom: 20px" @click="update"></i>
            <!--搜索-->
            <div class="handle-box">
                <el-input v-model="select_word" placeholder="关键词" class="handle-input mr10"
                          @keyup.enter.native="search">
                    <i slot="prefix" class="el-input__icon el-icon-search"></i>
                </el-input>
                <el-button type="primary" icon="search" @click="search">搜索</el-button>
            </div>
            <!--表格-->
            <el-table :data="tableData" border style="width: 100%">
                <el-table-column label="医生ID" prop="id"></el-table-column>
                <el-table-column label="医生名字">
                    <template slot-scope="scope">
                        <a :href="scope.row.url" target="_blank">{{scope.row.title}}</a>
                    </template>
                </el-table-column>
                <el-table-column label="医生所在医院" prop="company"></el-table-column>
            </el-table>
        </div>
    </div>
</template>

<script>
    export default {
        data() {
            return {
                /*URL*/
                URL: 'http://bigdata-api.huimeimt.cn/resource_server/meetingsmdm/meeting_doctorname/',
                /*获取token*/
                access_token: '',
                /*搜索*/
                select_word: '',
                /*表格*/
                tableData: [],
            }
        },
        created() {
            this.gainTtoken();
        },
        methods: {
            /*获取token*/
            search() {
                if (this.select_word != '') {
                    this.GET(this.URL, this.excludeSpecial(this.select_word), this.access_token)
                } else {
                    this.$message.warning('医生姓名不能为空！');
                }
            },
            /*搜索*/
            gainTtoken() {
                this.$axios({
                    method: 'GET',
                    url: 'http://bigdata-oauth.huimeimt.cn/Dataplatform/token',
                }).then((res) => {
                    this.access_token = res.data.access_token
                })
            },
            /*刷新*/
            update() {
                location.reload();
            },
            /*去除非法字符*/
            excludeSpecial(s) {
                s = s.replace(/[^\u4e00-\u9fa5a-zA-Z0-9\w]/g, ' ');
                return s;
            },
            /*GET请求*/
            GET(url, keyword, access_token) {
                this.$axios({
                    method: 'GET',
                    url: url + keyword + '?access_token=' + access_token,
                }).then((res) => {
                    if (res.data.result == '') {
                        this.$message.warning('无数据!');
                        this.tableData = [];
                    } else {
                        this.tableData = res.data.result
                    }

                })
            }
        }
    }
</script>

<style scoped>
    .handle-box {
        margin-bottom: 20px;
    }

    .handle-input {
        width: 300px;
        display: inline-block;
    }
</style>
